@charset "utf-8";
body {
	margin: 0;
	padding: 0;
	font-family: "微软雅黑";
}

* {
	-webkit-tap-highlight-color: transparent;
}

@font-face {
	font-family: "jz";
	src: url(../font/jz.ttf);
}

.jz {
	/*font-family: "jz";*/
}

.page {
	position: absolute;
	left: 0;
	top: 0;
	background-size: cover;
	background-position: center;
	display: none;
	overflow: hidden;
	background-image: url(../img/bg.png);
	transform: translate(0%, 0%);
	-ms-transform: translate(0%, 0%);
	-moz-transform: translate(0%, 0%);
	-webkit-transform: translate(0%, 0%);
	background-color: #e84509;
}

.page_transition {
	transition: transform 0.4s ease;
	-ms-transition: transform 0.4s ease;
	-moz-transition: transform 0.4s ease;
	-webkit-transition: transform 0.4s ease;
}

.page_outer,
.page_inner {
	position: absolute;
}

.preload {
	display: none;
}

.preload img {
	width: 1px;
	height: 1px;
	display: none;
}

.music_btn {
	position: fixed;
	width: 30px;
	height: 30px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	height: 30px;
	width: 30px;
	bottom: 15px;
	right: 15px;
}

.music_play {
	background-image: url(../img/music.png);
	animation: music_play 2s 0s linear infinite;
	-ms-animation: music_play 2s 0s linear infinite;
	-moz-animation: music_play 2s 0s linear infinite;
	-webkit-animation: music_play 2s 0s linear infinite;
}

@keyframes music_play {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

@-ms-keyframes music_play {
	from {
		-ms-transform: rotate(0deg);
	}
	to {
		-ms-transform: rotate(360deg);
	}
}

@-moz-keyframes music_play {
	from {
		-moz-transform: rotate(0deg);
	}
	to {
		-moz-transform: rotate(360deg);
	}
}

@-webkit-keyframes music_play {
	from {
		-webkit-transform: rotate(0deg);
	}
	to {
		-webkit-transform: rotate(360deg);
	}
}

.music_pause {
	background-image: url(../img/music_close.png);
}

.page_down {
	position: absolute;
	width: 8%;
	height: auto;
	left: 46%;
	bottom: 3%;
	opacity: 0;
}

@keyframes page_down {
	from {
		transform: translateY(0);
	}
	to {
		transform: translateY(-100%);
	}
}

@-ms-keyframes page_down {
	from {
		-ms-transform: translateY(0);
	}
	to {
		-ms-transform: translateY(-100%);
	}
}

@-moz-keyframes page_down {
	from {
		-moz-transform: translateY(0);
	}
	to {
		-moz-transform: translateY(-100%);
	}
}

@-webkit-keyframes page_down {
	from {
		-webkit-transform: translateY(0);
	}
	to {
		-webkit-transform: translateY(-100%);
	}
}

.page_0 {
	display: block;
}

.page .page_down {
	animation: fadeIn 0.5s 1.5s ease forwards, page_down 1.5s 0s ease infinite alternate;
	-ms-animation: fadeIn 0.5s 1.5s ease forwards, page_down 1.5s 0s ease infinite alternate;
	-moz-animation: fadeIn 0.5s 1.5s ease forwards, page_down 1.5s 0s ease infinite alternate;
	-webkit-animation: fadeIn 0.5s 1.5s ease forwards, page_down 1.5s 0s ease infinite alternate;
}

.loader_text {
	position: absolute;
	width: 70.7%;
	height: auto;
	left: 14.7%;
	top: 82.3%;
	text-align: center;
	color: white;
	font-size: 6vw;
	text-shadow: #5e1100 2px 0px 2px, #5e1100 0px 2px 2px, #5e1100 -2px 0px 2px, #5e1100 0px -2px 2px;
}

.loader_bar {
	position: absolute;
	width: 70.7%;
	height: auto;
	left: 14.7%;
	top: 82.3%;
}

.loader_bar_bg {
	display: block;
	width: 100%;
	height: auto;
}

.loader_bar_inner {
	position: absolute;
	width: 0%;
	height: 100%;
	left: 0;
	top: 0;
	background-image: url(../img/loader_bar_inner.png);
	background-position: left top;
	background-size: cover;
}

.firework_box img {
	position: absolute;
	height: auto;
	opacity: 0;
}

.firework_box img:nth-child(3n) {
	animation: firework 3s 0s linear infinite;
	-ms-animation: firework 3s 0s linear infinite;
	-moz-animation: firework 3s 0s linear infinite;
	-webkit-animation: firework 3s 0s linear infinite;
}

.firework_box img:nth-child(3n+1) {
	animation: firework 3s 1s linear infinite;
	-ms-animation: firework 3s 1s linear infinite;
	-moz-animation: firework 3s 1s linear infinite;
	-webkit-animation: firework 3s 1s linear infinite;
}

.firework_box img:nth-child(3n+2) {
	animation: firework 3s 2s linear infinite;
	-ms-animation: firework 3s 2s linear infinite;
	-moz-animation: firework 3s 2s linear infinite;
	-webkit-animation: firework 3s 2s linear infinite;
}

.firework_box img:nth-child(1) {
	position: absolute;
	width: 12.27%;
	height: auto;
	left: 4.00%;
	top: 50.17%;
}

.firework_box img:nth-child(2) {
	position: absolute;
	width: 14.27%;
	height: auto;
	left: 2.00%;
	top: 33.58%;
}

.firework_box img:nth-child(3) {
	position: absolute;
	width: 12.13%;
	height: auto;
	left: 72.40%;
	top: 53.07%;
}

.firework_box img:nth-child(4) {
	position: absolute;
	width: 10.00%;
	height: auto;
	left: 56.40%;
	top: 42.29%;
}

.firework_box img:nth-child(5) {
	position: absolute;
	width: 18.40%;
	height: auto;
	left: 13.07%;
	top: 47.43%;
}

.firework_box img:nth-child(6) {
	position: absolute;
	width: 18.40%;
	height: auto;
	left: 63.33%;
	top: 12.69%;
}

.firework_box img:nth-child(7) {
	position: absolute;
	width: 14.40%;
	height: auto;
	left: 41.87%;
	top: 53.07%;
}

.firework_box img:nth-child(8) {
	position: absolute;
	width: 9.07%;
	height: auto;
	left: 76.00%;
	top: 21.23%;
}

.firework_box img:nth-child(9) {
	position: absolute;
	width: 9.07%;
	height: auto;
	left: 20.93%;
	top: 26.70%;
}

.firework_box img:nth-child(10) {
	position: absolute;
	width: 20.40%;
	height: auto;
	left: 87.07%;
	top: 27.69%;
}

.firework_box img:nth-child(11) {
	position: absolute;
	width: 12.13%;
	height: auto;
	left: 85.73%;
	top: 39.64%;
}

.firework_box img:nth-child(12) {
	position: absolute;
	width: 11.07%;
	height: auto;
	left: 48.00%;
	top: 41.21%;
}

.firework_box img:nth-child(13) {
	position: absolute;
	width: 20.80%;
	height: auto;
	left: 26.67%;
	top: 23.96%;
}

@keyframes firework {
	0% {
		transform: scale(0.1);
		opacity: 0;
	}
	50% {
		transform: scale(1);
		opacity: 1;
	}
	100% {
		transform: scale(1.9);
		opacity: 0;
	}
}

@-ms-keyframes firework {
	0% {
		-ms-transform: scale(0.1);
		opacity: 0;
	}
	50% {
		-ms-transform: scale(1);
		opacity: 1;
	}
	100% {
		-ms-transform: scale(1.9);
		opacity: 0;
	}
}

@-moz-keyframes firework {
	0% {
		-moz-transform: scale(0.1);
		opacity: 0;
	}
	50% {
		-moz-transform: scale(1);
		opacity: 1;
	}
	100% {
		-moz-transform: scale(1.9);
		opacity: 0;
	}
}

@-webkit-keyframes firework {
	0% {
		-webkit-transform: scale(0.1);
		opacity: 0;
	}
	50% {
		-webkit-transform: scale(1);
		opacity: 1;
	}
	100% {
		-webkit-transform: scale(1.9);
		opacity: 0;
	}
}

.full {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

.rule_pop {
	display: none;
	background-color: rgba(0, 0, 0, 0.7);
}

.page_1_7 {
	position: absolute;
	width: 76.13%;
	height: auto;
	left: 15.73%;
	top: 23.88%;
}

.page_1_6 {
	position: absolute;
	width: 38.67%;
	height: auto;
	left: 30.80%;
	top: 78.94%;
}

.page_1_5 {
	position: absolute;
	width: 35.20%;
	height: auto;
	left: 32.67%;
	top: 90.13%;
}

.logo {
	position: absolute;
	width: 19.33%;
	height: auto;
	left: 77.33%;
	top: 1.66%;
}

.page_1_3 {
	position: absolute;
	width: 77.33%;
	height: auto;
	left: 13.33%;
	top: 6.38%;
}

.support {
	position: absolute;
	width: 100.00%;
	height: auto;
	left: 0.00%;
	bottom: 0%;
}

.page_1_1 {
	position: absolute;
	width: 76.00%;
	height: auto;
	left: 12.13%;
	top: 18.57%;
}

.page_1_0 {
	position: absolute;
	width: 7.20%;
	height: auto;
	left: 77.47%;
	top: 20.07%;
}

.page_2_2 {
	position: absolute;
	width: 59.33%;
	height: auto;
	left: 21.33%;
	top: 9.37%;
}

.page_2_1 {
	position: absolute;
	width: 12.13%;
	height: auto;
	left: 45.87%;
	top: 45.52%;
	animation: page_2_1 1s 0s linear infinite alternate;
	-ms-animation: page_2_1 1s 0s linear infinite alternate;
	-moz-animation: page_2_1 1s 0s linear infinite alternate;
	-webkit-animation: page_2_1 1s 0s linear infinite alternate;
}

@keyframes page_2_1 {
	from {
		transform: translateX(-100%);
	}
	to {
		transform: translateX(100%);
	}
}

@-ms-keyframes page_2_1 {
	from {
		-ms-transform: translateX(-100%);
	}
	to {
		-ms-transform: translateX(100%);
	}
}

@-moz-keyframes page_2_1 {
	from {
		-moz-transform: translateX(-100%);
	}
	to {
		-moz-transform: translateX(100%);
	}
}

@-webkit-keyframes page_2_1 {
	from {
		-webkit-transform: translateX(-100%);
	}
	to {
		-webkit-transform: translateX(100%);
	}
}

.page_2_0 {
	position: absolute;
	width: 76.80%;
	height: auto;
	left: 11.07%;
	top: 70.65%;
}

.page_3 {
	background-image: url(../img/bg_3.png);
	background-position: bottom center;
}

.game_ready {
	display: none;
}

.game_ready img {
	display: block;
	position: absolute;
	width: 50.4%;
	height: auto;
	left: 25.1%;
	top: 36.4%;
	opacity: 0;
}

.ready_act {
	animation: ready_act 1s 0s ease forwards;
	-ms-animation: ready_act 1s 0s ease forwards;
	-moz-animation: ready_act 1s 0s ease forwards;
	-webkit-animation: ready_act 1s 0s ease forwards;
}

@keyframes ready_act {
	from {
		transform: scale(2);
		opacity: 0;
	}
	to {
		transform: scale(1);
		opacity: 1;
	}
}

@-ms-keyframes ready_act {
	from {
		-ms-transform: scale(2);
		opacity: 0;
	}
	to {
		-ms-transform: scale(1);
		opacity: 1;
	}
}

@-moz-keyframes ready_act {
	from {
		-moz-transform: scale(2);
		opacity: 0;
	}
	to {
		-moz-transform: scale(1);
		opacity: 1;
	}
}

@-webkit-keyframes ready_act {
	from {
		-webkit-transform: scale(2);
		opacity: 0;
	}
	to {
		-webkit-transform: scale(1);
		opacity: 1;
	}
}

.page_3_2 {
	position: absolute;
	right: 2.5%;
	top: 2.5%;
	color: #ffea5c;
	font-size: 8vw;
	text-shadow: #5e1100 2px 0px 2px, #5e1100 0px 2px 2px, #5e1100 -2px 0px 2px, #5e1100 0px -2px 2px;
}

.page_3_1 {
	position: absolute;
	width: 32.27%;
	height: auto;
	left: 1.73%;
	top: 1.99%;
}

.game_score_bar {
	display: block;
	width: 100%;
	height: auto;
}

.game_score_coin {
	position: absolute;
	width: 100%;
	height: auto;
	left: 0;
	top: 0;
}

.game_score_bar_inner {
	position: absolute;
	width: 66%;
	height: 40%;
	left: 27.9%;
	top: 23.6%;
}

.game_score_bar_grow {
	position: absolute;
	width: 0%;
	height: 100%;
	left: 0;
	top: 0;
	background-image: url(../img/game_score_bar_inner.png);
	background-size: cover;
	background-position: left top;
	background-repeat: no-repeat;
}

.game_score_text {
	position: absolute;
	right: 10%;
	top: 27%;
	color: white;
	font-size: 4vw;
	text-shadow: #5e1100 2px 0px 2px, #5e1100 0px 2px 2px, #5e1100 -2px 0px 2px, #5e1100 0px -2px 2px;
}

.page_3_0 {
	position: absolute;
	width: 113.33%;
	height: auto;
	left: -7.20%;
	top: 44.11%;
}

.game_canvas {
	position: absolute;
	width: 200%;
	height: 172.8%;
	left: 0;
    top: 11.5%;;
	transform-origin: left top;
	-ms-transform-origin: left top;
	-moz-transform-origin: left top;
	-webkit-transform-origin: left top;
	transform: scale(0.5);
	-ms-transform: scale(0.5);
	-moz-transform: scale(0.5);
	-webkit-transform: scale(0.5);
}

.fail_boom {
	display: none;
}

.fail_boom_act {
	animation: fail_boom 0.5s 0s cubic-bezier(.61, .15, .83, .48) forwards;
	-ms-animation: fail_boom 0.5s 0s cubic-bezier(.61, .15, .83, .48) forwards;
	-moz-animation: fail_boom 0.5s 0s cubic-bezier(.61, .15, .83, .48) forwards;
	-webkit-animation: fail_boom 0.5s 0s cubic-bezier(.61, .15, .83, .48) forwards;
}

@keyframes fail_boom {
	from {
		transform: scale(0.1);
		opacity: 0;
	}
	to {
		transform: scale(1);
		opacity: 1;
	}
}

@-ms-keyframes fail_boom {
	from {
		-ms-transform: scale(0.1);
		opacity: 0;
	}
	to {
		-ms-transform: scale(1);
		opacity: 1;
	}
}

@-moz-keyframes fail_boom {
	from {
		-moz-transform: scale(0.1);
		opacity: 0;
	}
	to {
		-moz-transform: scale(1);
		opacity: 1;
	}
}

@-webkit-keyframes fail_boom {
	from {
		-webkit-transform: scale(0.1);
		opacity: 0;
	}
	to {
		-webkit-transform: scale(1);
		opacity: 1;
	}
}

.game_fail_pop,
.game_suc_pop {
	background-color: rgba(0, 0, 0, 0.5);
	display: none;
}

.share_pop {
	background-color: rgba(0, 0, 0, 0.4);
	display: none;
}

.share_pop img {
	position: absolute;
	width: 100%;
	height: auto;
	left: 0;
	top: 0;
}

.page_4_8 {
	position: absolute;
	width: 68.53%;
	height: auto;
	left: 15.87%;
	top: 23.80%;
}

.page_4_7 {
	position: absolute;
	width: 68.53%;
	height: auto;
	left: 15.87%;
	top: 23.80%;
}

.game_over_score {
	position: absolute;
	width: 60%;
	height: auto;
	left: 20%;
	top: 32.34%;
	text-align: center;
	color: #ffea5c;
	font-size: 12vw;
	text-shadow: #5e1100 2px 0px 2px, #5e1100 0px 2px 2px, #5e1100 -2px 0px 2px, #5e1100 0px -2px 2px;
}

.page_4_5 {
	position: absolute;
	width: 27.07%;
	height: auto;
	left: 36.46%;
	top: 51.74%;
}

.page_4_4 {
	position: absolute;
	width: 27.07%;
	height: auto;
	left: 36.46%;
	top: 51.74%;
}

.page_4_3 {
	position: absolute;
	width: 26.93%;
	height: auto;
	left: 51.20%;
	top: 51.74%;
}

.page_4_2 {
	position: absolute;
	width: 31.33%;
	height: auto;
	left: 36.80%;
	top: 41.63%;
}

.page_4_1 {
	position: absolute;
	width: 36.93%;
	height: auto;
	left: 33.87%;
	top: 41.63%;
}

.page_4_0 {
	position: absolute;
	width: 52.13%;
	height: auto;
	left: 24.27%;
	top: 65.67%;
}

.draw_pop {
	background-color: rgba(0, 0, 0, 0.4);
	display: none;
}

.draw_get_bonus {
	display: none;
}

.draw_get_empty {
	display: none;
}

.page_5_6 {
	position: absolute;
	width: 68.53%;
	height: auto;
	left: 15.87%;
	top: 22.47%;
}

.page_5_5 {
	position: absolute;
	width: 53.33%;
	height: auto;
	left: 24.53%;
	top: 43.03%;
}

.page_5_4 {
	position: absolute;
	width: 53.33%;
	height: auto;
	left: 24.53%;
	top: 31.26%;
}

.page_5_3 {
	position: absolute;
	width: 19.1%;
	height: auto;
	left: 29.5%;
	top: 65.7%;
}

.page_5_2 {
	position: absolute;
	width: 19.1%;
	height: auto;
	right: 29.5%;
	top: 65.7%;
}

.draw_pop_link {
	position: absolute;
	width: 35.2%;
	height: auto;
	left: 32.4%;
	top: 73.4%;
}

.page_5_1 {
	position: absolute;
	width: 53.33%;
	height: auto;
	left: 24.53%;
	top: 31.26%;
}

.page_5_0 {
	position: absolute;
	width: 60%;
	height: auto;
	left: 20%;
	top: 42.79%;
}

.draw_ammount {
	text-align: center;
	color: #ffea5c;
	font-size: 12vw;
	text-shadow: #5e1100 2px 0px 2px, #5e1100 0px 2px 2px, #5e1100 -2px 0px 2px, #5e1100 0px -2px 2px;
}

.main_box {
	width: 750px;
	margin: auto;
	overflow: hidden;
	background-size: 100% auto;
	background-position: left top;
	background-repeat: no-repeat;
	background-color: #f2f2f2;
	position: relative;
}

.login_header {
	height: 95px;
	line-height: 95px;
	background-color: #ffffff;
	border-bottom: solid 2px #cecece;
	text-align: center;
}

.log_back {
	position: absolute;
	width: 47px;
	height: 47px;
	left: 15px;
	top: 25px;
}

.login_header span {
	text-align: center;
	font-size: 36px;
	color: #2f2f2f;
}

.login_main {
	width: 650px;
	height: auto;
	margin: auto;
}

.login_row {
	position: relative;
	height: 95px;
	line-height: 95px;
	border-bottom: solid 2px #cdcdcd;
}

.login_input {
	position: absolute;
	width: 100%;
	height: 95px;
	line-height: 95px;
	text-align: left;
	font-size: 32px;
	border: none;
	padding: 0px;
	background-color: transparent;
	outline: none;
}

.text_clear {
	position: absolute;
	display: block;
	width: 50px;
	height: 50px;
	right: 0;
	top: 23px;
	background-image: url(../img/text_clear.png);
	background-size: 100% 100%;
}

.get_verify_code {
	position: absolute;
	display: block;
	width: 200px;
	height: 60px;
	text-align: center;
	line-height: 60px;
	color: white;
	font-size: 38px;
	background-color: #fd0000;
	border-radius: 6px;
	right: 0;
	top: 17px;
}

.pass_view {
	position: absolute;
	display: block;
	width: 64px;
	height: 33px;
	right: 0;
	top: 31px;
	background-image: url(../img/pass_view.png);
	background-size: 100% 100%;
}

.pass_view.act {
	background-image: url(../img/pass_view_b.png);
}

.login_submit {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	background-color: transparent;
	padding: 0px;
	border: none;
	margin: 0px;
	outline: none;
	display: block;
	width: 288px;
	height: 60px;
	text-align: center;
	line-height: 60px;
	border: none;
	padding: 0px;
	color: white;
	font-size: 38px;
	background-color: #fd0000;
	outline: none;
	margin: 20px auto;
	border-radius: 6px;
}

.password_tip {
	color: #b7b7b7;
	font-size: 20px;
	display: block;
	text-align: left;
	line-height: 36px;
}

.login_tip {
	position: absolute;
	width: 650px;
	height: auto;
	left: 50px;
	bottom: 5%;
	color: #b7b7b7;
	font-size: 25px;
	line-height: 32px;
}

.draw_get_alget,
.draw_nomore,
.draw_act_over {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-color: rgba(0, 0, 0, 0.5);
	display: none;
}

.alreadyget_pop {
	position: absolute;
	width: 63.2%;
	height: auto;
	left: 18.5%;
	top: 41.5%;
}

.alreadyget_confirm,
.draw_nomore_confirm,
.draw_act_over_confirm {
	position: absolute;
	width: 22%;
	height: auto;
	left: 39.1%;
	top: 56.9%;
}